<template>
	<view class="listImg">
		<image v-if="img" :src="img" mode="aspectFit"></image>
		<image v-if="arrImg.length" v-for="(item, i) in arrImg" :src="item.photoUrl" :key="i" mode="widthFix" @tap="previewOpen(i)"></image>
		<previewImg ref="previewImage" :imgs="arrImg"></previewImg>
	</view>
</template>

<script>
import previewImg from '@/components/goodinfoImg/previewImg.vue'

export default {
	components: {
		previewImg
	},
	data() {
		return {
			img: '',
			arrImg: []
		}
	},
	onLoad(option) {
		this._goodImg = option.goodImg
		this._id = option.id
	},
	mounted() {
		let params = {
			// page: this.page.pageIndex,
			// limit: this.page.pageSize
		}
		params.id = this._id
		this.init(params)
	},
	methods: {
		init(params) {
			this.$api
				.getGoodsPhotoInfo(params)
				.then(res => {
					if (res.success) {
						if (res.rows.length == 0) {
							this.img = this._goodImg
						} else {
							this.arrImg = res.rows
						}
					}
				})
				.catch(err => {
					console.log('request fail', err)
				})
		},
		//打开预览e
		previewOpen(param) {
			console.log(param)
			this.$refs.previewImage.open(param) // 传入当前选中的图片地址或序号
		}
	}
}
</script>

<style lang="scss" scoped>
.listImg {
	margin: 20rpx;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	image {
		// width: 100%;
		margin: 10rpx 0;
	}
}
</style>
